<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="lib/layui/css/layui.css">
    <link rel="stylesheet" href="css/admin.css">
    <script src="js/vue.js"></script>
    <script src="js/axios.js"></script>
</head>
<body>
<div id="app">
    <div class="layui-form-item">
        <label class="layui-form-label" >用户名</label>
        <div class="layui-input-inline">
            <input type="text" name="username" v-model="page.condition" class="layui-input">
        </div>
        <button type="button" v-on:click="goSearch"  class="layui-btn layui-btn-normal layui-btn-radius">搜索</button>
    </div>

<table class="layui-table">
    <colgroup>
        <col width="20%">
        <col width="20%">
        <col width="15%">
        <col width="15%">
        <col width="15%">
        <col width="15%">
    </colgroup>
    <thead>
    <tr>
        <th>编号</th>
        <th>用户名</th>
        <th>可疑类型</th>
        <th>状态</th>
        <th>可疑次数</th>
        <th>操作</th>
    </tr>
    </thead>
    <tbody>
    <tr v-for="(item,i) in exec.list">
        <td>{{item.suspectId}}</td>
        <td>{{item.userid}}</td>
        <td>{{item.suspectType}}</td>
        <td>
            <span v-if="item.suspectStatus ==1001">被标记 </span>
            <span v-else>未标记</span>
        </td>
        <td>{{item.suspectCount}}</td>
        <td>
            <span v-if="item.suspectStatus ==1001">
                <button type="button" v-on:click="toFlag(i)"  	class="layui-btn layui-btn-radius layui-btn-danger">标记</button>
            </span>
            <span v-else>
                <button type="button" v-on:click="cancelFlag(i)"  class="layui-btn layui-btn-radius">取消标记</button>
            </span>
        </td>
    </tr>
    </tbody>
</table>
    <button class="layui-btn layui-btn-radius"  v-on:click="prevPage">上一页</button>
    <span style="font-size: 20px">当前{{page.index}}</span>|<span style="font-size: 20px">共{{exec.count}}</span>
    <button class="layui-btn layui-btn-radius"  v-on:click="nextPage">下一页</button>
</div>
<script>
    var app = new Vue({
        el:"#app",
        data:{
            page:{
                index:1,
                pageSize:5,
                condition:"",
                start:null,
                end:null,
                status:null
            },
            exec:{}
        },
        mounted:function () {
            this.getExec()
        },
        methods:{
            getExec:function () {
                var that = this;
                axios.post("/exce/find",that.page).then(function (res) {
                    if(res.data.msg == "NO_AUTH"){
                        location.href="no_auth.html";
                    }else {
                        that.exec=res.data.t;

                    }

                })
            },
            goSearch:function () {
                this.page.index=1;
                console.log(this.page)
                this.getExec();
            },
            prevPage:function () {
                if(this.page.index>1){
                    this.page.index--;
                    this.getTransferPage();
                }

            },
            nextPage:function () {
                if (this.page.index<this.exec.count) {
                    this.page.index++;
                    this.getTransferPage();
                }
            },
            toFlag:function (i) {
               var that = this;

               axios.post("/exce/modify/"+that.exec.list[i].userid).then(function () {
                   that.getExec();
               })
            },
            cancelFlag:function (i) {
                var that = this;

                axios.post("/exce/cancel/"+that.exec.list[i].userid).then(function () {

                    that.getExec();
                })
            }
        }
    })
</script>
</body>
</html>
<script src="js/jquery-3.4.1.min.js"></script>
<script src="lib/layui/layui.js"></script>
<script src="js/admin.js"></script>